chore(website): update to React 19#1064
Merged
fengelniederhammer merged 8 commits intomainfrom Mar 19, 2026
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
74fc86e to
747decf
Compare
Contributor
There was a problem hiding this comment.
Pull request overview
Updates the website’s React runtime to React 19 and adapts the codebase (notably the GenSpectrum web-component wrappers) to updated React typings/behavior and @genspectrum/dashboard-components APIs.
Changes:
- Bump dependencies to React 19 / React DOM 19 and
@genspectrum/dashboard-components@^1.16.0. - Update GenSpectrum web-component integrations to pass structured values (objects/arrays/numbers) instead of
JSON.stringify(...). - Fix TypeScript compatibility issues introduced by the upgrade (ref nullability,
onInputtyping, event target access, component rename typo).
Reviewed changes
Copilot reviewed 25 out of 26 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| website/src/styles/containers/Modal.tsx | Updates modalRef typing to reflect React 19 ref nullability. |
| website/src/layouts/OrganismPage/OrganismViewPageLayout.tsx | Passes mutationAnnotations directly to <gs-app> instead of JSON string. |
| website/src/components/views/wasap/WasapPage.tsx | Passes structured mutationAnnotations/mutationLinkTemplate props into <gs-app>. |
| website/src/components/subscriptions/overview/SubscriptionEntry.tsx | Aligns dialog ref prop typing with React 19 ref nullability. |
| website/src/components/pageStateSelectors/VariantSelector.tsx | Uses event.currentTarget.value for safer typed input handling. |
| website/src/components/pageStateSelectors/BaselineSelector.tsx | Fixes GsNumberRangeFilter import/usage after renaming typo. |
| website/src/components/genspectrum/VariantQueryFilter.tsx | Switches onInput prop typing from change-event to input-event handler. |
| website/src/components/genspectrum/GsTextFilter.tsx | Updates ref initialization and passes lapisFilter as structured value. |
| website/src/components/genspectrum/GsStatistics.tsx | Passes numerator/denominator filters as structured values. |
| website/src/components/genspectrum/GsSequencesByLocation.tsx | Passes structured filters/views and uses views constants for some view values. |
| website/src/components/genspectrum/GsRelativeGrowthAdvantage.tsx | Passes filters directly and uses numeric generationTime. |
| website/src/components/genspectrum/GsQueriesOverTime.tsx | Removes JSON stringification for filters/queries/views and related optional props. |
| website/src/components/genspectrum/GsPrevalenceOverTime.tsx | Removes JSON stringification for filters/views/config arrays. |
| website/src/components/genspectrum/GsNumberSequencesOverTime.tsx | Removes JSON stringification for filter and views props. |
| website/src/components/genspectrum/GsNumberRangeFilter.tsx | Renames component to GsNumberRangeFilter, updates ref handling, passes structured value. |
| website/src/components/genspectrum/GsMutationsOverTime.tsx | Removes JSON stringification for filter/views and optional props. |
| website/src/components/genspectrum/GsMutations.tsx | Passes structured filters and uses views constants array. |
| website/src/components/genspectrum/GsMutationFilter.tsx | Updates ref init and passes structured initial/enabled mutation type values. |
| website/src/components/genspectrum/GsMutationComparison.tsx | Passes structured filters and uses views constants. |
| website/src/components/genspectrum/GsLocationFilter.tsx | Updates ref init and passes structured fields/filter/value. |
| website/src/components/genspectrum/GsLineageFilter.tsx | Updates ref init and passes structured value/lapisFilter. |
| website/src/components/genspectrum/GsDateRangeFilter.tsx | Updates ref init and passes structured dateRangeOptions and value. |
| website/src/components/genspectrum/GsAggregate.tsx | Removes JSON stringification for views/fields/filter. |
| website/src/components/genspectrum/AdvancedQueryFilter.tsx | Switches to onInput event typing and uses event.currentTarget.value. |
| website/package.json | Bumps React/React DOM and @types/react*, updates dashboard-components dependency. |
| website/package-lock.json | Locks updated dependency graph for the React 19 + dashboard-components bump. |
Files not reviewed (1)
- website/package-lock.json: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
You can also share your feedback on Copilot code review. Take the survey.
79c2db7 to
4919a87
Compare
4919a87 to
64e3091
Compare
64e3091 to
41b758d
Compare
fhennig
approved these changes
Mar 18, 2026
Contributor
fhennig
left a comment
There was a problem hiding this comment.
Did some spot checking locally, looks all good to me!
The change that we don't have to serialize is great.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Uses the new components version that has type declarations that are compatible with React 19: GenSpectrum/dashboard-components#673
The main change in React 19 for us is that web components have better support in React. We don't need to serialize attributes anymore, we can simply pass them to the component as we would with any other component / native HTML element.
Screenshot
PR Checklist
- [ ] All necessary documentation has been adapted.